<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
>
<head th:include="head :: head">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"></meta>
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8"></meta>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1"></meta>
    <meta name="authorization" content="authorization" th:content="111111"/>

    <title>Gentelella Alela! | </title>

    <!-- Bootstrap -->
    <link href="../static/vendors/bootstrap/dist/css/bootstrap.min.css"
          rel="stylesheet"/>
    <!-- Font Awesome -->
    <link href="../static/vendors/font-awesome/css/font-awesome.min.css"
          rel="stylesheet"/>
    <!-- NProgress -->
    <link href="../static/vendors/nprogress/nprogress.css" rel="stylesheet"/>
    <!-- iCheck -->
    <link href="../static/vendors/iCheck/skins/flat/green.css"
          rel="stylesheet"/>

    <!-- bootstrap-progressbar -->
    <link href="../static/vendors/bootstrap-progressbar/css/bootstrap-progressbar-3.3.4.min.css"
          rel="stylesheet"/>
    <!-- JQVMap -->
    <link href="../static/vendors/jqvmap/dist/jqvmap.min.css"
          rel="stylesheet"/>
    <!-- bootstrap-daterangepicker -->
    <link href="../static/vendors/bootstrap-daterangepicker/daterangepicker.css"
          rel="stylesheet"/>

    <!--&lt;!&ndash; Custom Theme Style &ndash;&gt;-->
    <link href="../static/build/css/custom.min.css" rel="stylesheet"/>

</head>
<style>
    .mjd li {
        width: 14px;
    }
    .mjd li img {
        width: 100%;
    }
    *{ margin: 0px; padding: 0px;}
    .content { width: 100%; height: 148px; overflow: hidden;  }
footer { height: 0; opacity: 0; }
    .content .li{ width: 100%; height: 40px; border-bottom:#ccc solid 1px; overflow: hidden;cursor: pointer;}
    .content2 { width: 100%; height: 148px; overflow: hidden;  }

    .content2 .li2{ width: 100%; height: 40px; border-bottom:#ccc solid 1px; overflow: hidden;cursor: pointer;}
    .js_block {  width: 100%; height: 20px; color: #000;font-size: 12px; text-align: left; margin-right: 0; margin-bottom: 15px }
    .progress.progress_sm, .progress.progress_sm .progress-bar { height: 14px!important; text-align: left; color: #fff; font-size: 12px; line-height: 14px;     margin-bottom: 7px; }
    .dashboard_graph p {
        margin: 0 0 10px 0;
    }
</style>
<body class="nav-md">
<div class="container body">
    <div class="main_container">
        <div class="col-md-3 left_col">
            <div class="left_col scroll-view" th:include="letree :: letree">
                <div class="navbar nav_title" style="border: 0;">
                    <a href="maintenance_index.html" class="site_title" style="margin-top: 10px;">
                        <i class="fa fa-paw" style="margin-left: 17px;"></i> <span></span>
                    </a>

                </div>

                <div class="clearfix"></div>

                <!-- menu profile quick info -->
                <div class="profile clearfix">
                    <div class="profile_pic">
                        <img src="../static/images/img.jpg"
                             th:src="@{/images/img.jpg}" alt="..."
                             class="img-circle profile_img"/>
                    </div>
                    <div class="profile_info">
                        <span>欢迎您,<h2 style="display: inline-block">管理员</h2></span>
                        <div id="clock3"></div>
                    </div>
                </div>
                <!-- /menu profile quick info -->

                <br/>

                <!-- sidebar menu -->
                <div id="sidebar-menu"
                     class="main_menu_side hidden-print main_menu">
                    <div class="menu_section">
                        <h3>基础数据资源管理子系统</h3>
                        <ul class="nav side-menu">
                            <li><a href="../monitor/monitor_index.html"> <i class="fa fa-gavel"></i> 部件采集 </a></li>
                            <li><a href="#"><i class="fa fa-folder-open-o"></i> 部件管理 </a></li>
                            <li><a><i class="fa fa-life-ring"></i> 责任网格配置</a>
                            </li>
                        </ul>
                    </div>
                </div>
                <!-- /sidebar menu -->

                <!-- /menu footer buttons -->
                <div class="sidebar-footer hidden-small">
                    <a data-toggle="tooltip" data-placement="top"
                       title="Settings">
                        <span class="glyphicon glyphicon-cog"
                              aria-hidden="true"></span>
                    </a>
                    <a data-toggle="tooltip" data-placement="top"
                       title="FullScreen" class="toFullScreen">
                        <span class="glyphicon glyphicon-fullscreen"
                              aria-hidden="true"></span>
                    </a>
                    <a data-toggle="tooltip" data-placement="top" title="Lock">
                        <span class="glyphicon glyphicon-eye-close"
                              aria-hidden="true"></span>
                    </a>
                    <a data-toggle="tooltip" data-placement="top" title="Logout"
                       href="login.html">
                        <span class="glyphicon glyphicon-off"
                              aria-hidden="true"></span>
                    </a>
                </div>
                <!-- /menu footer buttons -->
            </div>
        </div>

        <!-- top navigation -->
        <!--头部-->
        <div class="top_nav">
            <!--头部-->
            <div class="nav_menu">
                <nav>
                    <div class="nav toggle">
                        <a id="menu_toggle"><i class="fa fa-bars"></i></a>
                        <ul class="nav navbar-nav navbar-left"><a class="user-profile dropdown-toggle"></a></ul>
                    </div>
                    <ul class="nav navbar-nav navbar-right">
                        <li class="">
                            <a href="javascript:;"
                               class="user-profile dropdown-toggle"
                               data-toggle="dropdown" aria-expanded="false">
                                <img src="../../static/images/tx_2.png"
                                     th:src="@{/images/tx_2.png}" alt="" th:text="${empName}"/>
                                <span class=" fa fa-angle-down"></span>
                            </a>
                            <ul class="dropdown-menu dropdown-usermenu pull-right" style="position: absolute;z-index: 10001">
                                <li><a class="fa fa-user"  onclick="js_method()"  data-toggle="modal" data-target="#myModal"> 基本资料</a></li>
                                <li>
                                    <a class="fa fa-edit" href="javascript:;"  data-toggle="modal" data-target="#myModa2">
                                        <span>修改密码</span>
                                    </a>
                                </li>
                                <!--<li><a class="fa fa-bell-o" href="javascript:;"  data-toggle="modal" data-target="#myModa3">我的消息</a></li>-->
                                <li>
                                    <a href="" th:href="@{/login}"><i class="fa fa-sign-out"></i>退出</a>
                                    <!--</ul>-->
                                </li>
                            </ul>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>        <!-- /top navigation -->

        <!-- page content -->
        <div class="right_col fullscreenBox" role="main">
            <div class="row">
                <div class="col-md-6 col-sm-6 col-xs-12">
                <div class="x_panel" style="position: relative">
                    <div class="x_title">
                        <h2><img src="../static/images/dbsj1.png" width="20px" height="20px" th:src="@{/images/dbsj1.png}"> 待办事件</h2>
                        <div class="clearfix"></div>
                    </div>
                    <div class="content2" style="height: 148px;">

                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th>标题</th>
                                <th>时间</th>
                                <th>上报人</th>
                            </tr>
                            </thead>
                            <tbody type="box2">
                            <tr class="li2" th:each="info,iterStat : ${queryEvent}" th:id="${info.eventId}">
                                <td><a href="index.html" th:href="@{/eventTurn/toWorkIndex(eventId=${info.eventId})}" th:text="${info.eventTitle}">
                                </a></td>
                                <td th:text="${info.eventContent}"></td>
                                <td th:text="${info.empName}"></td>
                            </tr>
                            </tbody>
                        </table>

                    </div>
                    <!--<div style="position: absolute;bottom: 0;right: 0;">-->
                        <!--<img src="../static/images/dbsj.png" th:src="@{/images/dbsj.png}">-->
                    <!--</div>-->
                </div>
            </div>
                <div class="col-md-6 col-sm-6 col-xs-12">
                <div class="x_panel">
                    <div class="x_title">
                        <h2><img src="../static/images/tzgg1.png" width="20px" height="20px" th:src="@{/images/tzgg1.png}"> 通知公告</h2>
                        <div class="clearfix"></div>
                    </div>
                    <div class="content" style="height: 148px;">
                        <table class="table table-striped ">
                            <thead>
                            <tr>
                                <th>标题</th>
                                <th>时间</th>
                                <th>通知类别</th>
                                <th>上报人</th>

                            </tr>
                            </thead>
                            <tbody type="box">
                                <tr class="li2" th:each="info,iterStat : ${notice}" th:id="${info.noticeId}" onclick="queryNotice(this)" data-toggle="modal" data-target="#myModal2">
                                    <td th:text="${info.noticeTitle}"></td>
                                    <td th:text="${info.cdate}"></td>
                                    <td th:text="${info.noticeType}"></td>
                                    <td th:text="${info.publicName}"></td>
                                </tr>
                            </tbody>
                        </table>



                    </div>
                    <!--<div style="position: absolute;bottom: 0;right: 0;">-->
                        <!--<img src="../static/images/tzgg.png" th:src="@{/images/tzgg.png}">-->
                    <!--</div>-->
                </div>
            </div>
            </div>

            <div class="row">
                <div class="col-md-12 col-sm-12 col-xs-12">
                    <div class="dashboard_graph">

                        <div class="row x_title">
                            <div class="col-md-6">
                                <h2>事件完成率 </h2>
                            </div>

                        </div>

                        <div class="col-md-9 col-sm-9 col-xs-12">
                            <div id="eventChart"
                                 class="demo-placeholder"></div>
                        </div>
                        <div class="col-md-3 col-sm-3 col-xs-12 bg-white">
                            <div class="x_title">
                                <h2>事件占比</h2>
                                <div class="clearfix"></div>
                            </div>

                            <div class="col-md-12 col-sm-12 col-xs-6">
                                <div>
                                    <div class="" id="finish" style="position: relative;">

                                    </div>
                                </div>

                            </div>
                            <div class="col-md-12 col-sm-12 col-xs-6">
                                <div>
                                    <div class="" id="deal" style="position: relative;">

                                    </div>
                                </div>
                            </div>
                            <div class="col-md-12 col-sm-12 col-xs-6">
                                <div>
                                    <p>网格长事件</p>
                                    <div class="" id="wgEvent" style="position: relative;">

                                    </div>
                                </div>
                            </div>

                        </div>

                        <div class="clearfix"></div>
                    </div>
                </div>

            </div>
            <br/>
            <div class="copyrights">Collect from <a
                    href="http://www.cssmoban.com/" title="网站模板">网站模板</a></div>

            <div class="row">
                <div class="col-md-4 col-sm-4 col-xs-12" style="width: 29.1%;">
                    <div class="x_panel tile  ">
                        <div class="x_title">
                            <h2>天气预报</h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content" style="height: 295px; overflow: hidden;">
                            <iframe src="//www.seniverse.com/weather/weather.aspx?uid=UAFDADE39E&cid=CHHL000000&l=zh-CHS&p=SMART&a=1&u=C&s=1&m=2&x=1&d=5&fc=&bgc=&bc=&ti=0&in=1&li=" frameborder="0" scrolling="no"   height="350" style="width: 100%;  margin-top: 28px;" allowTransparency="true"></iframe>
                        </div>
                    </div>
                </div>


                <div class="col-md-5 col-sm-4 col-xs-12">
                    <div class="x_panel tile   overflow_hidden">
                        <div class="x_title">
                            <h2>网格长上报事件数</h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content" style="height: 295px; overflow: hidden;">
                            <div id="wgEventEcha" class="demo-placeholder"> </div>
                        </div>
                    </div>
                </div>


                <div class="col-md-3 col-sm-4 col-xs-12" style="width: 29.2%;">
                    <div class="x_panel tile  ">
                        <div class="x_title">
                            <h2>人口密集度</h2>
                            <div class="clearfix"></div>
                        </div>
                        <div class="x_content" style="height: 295px; overflow: hidden;">
                            <div class="col-xs-12 bg-white progress_summary" >
                                <div class="row" style="border-bottom: 1px solid #eee;padding-bottom: 10px" id="CZpopulation">

                                </div>
                                <div class="row" style="border-bottom: 1px solid #eee;padding-bottom: 10px" id="LDpopulation">

                                </div>
                                <div class="row" style="border-bottom: 1px solid #eee;padding-bottom: 10px" id="DYpopulation">

                                </div>
                                <div class="row" style="border-bottom: 1px solid #eee;padding-bottom: 10px" id="FNYpopulation">

                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

        </div>
        <!-- /page content -->

        <!-- footer content -->
        <!--<footer>-->
            <!--<div class="pull-right">-->
                <!--copyright©2017&nbsp;<img src="../static/images/liantong2.png" width="14px" height="14px"-->
                                         <!--style="margin-top: -4px"-->
                                         <!--th:src="@{/images/liantong2.png}">&nbsp;中国联通系统集成分公司-->
                <!--&lt;!&ndash;Gentelella - Bootstrap Admin Template by Colorlib. More&ndash;&gt;-->
                <!--&lt;!&ndash;Templates <a href="http://www.cssmoban.com/" target="_blank"&ndash;&gt;-->
                <!--&lt;!&ndash;title="模板之家">模板之家</a> - Collect from <a&ndash;&gt;-->
                <!--&lt;!&ndash;href="http://www.cssmoban.com/" title="网页模板"&ndash;&gt;-->
                <!--&lt;!&ndash;target="_blank">网页模板</a>&ndash;&gt;-->
            <!--</div>-->
            <!--<div class="clearfix"></div>-->
        <!--</footer>-->
        <!-- /footer content -->

    </div>
</div>


<!--基本资料-->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    基本资料
                </h4>
            </div>
            <div class="modal-body">
                <form action="" id="findForm" class="form-horizontal">
                    <div class="row">
                        <div class="form-group col-md-6">
                            <label class="control-label col-md-4">登录名：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="loginName" readonly/>
                            </div>
                        </div>
                        <div class="form-group col-md-6">
                            <label class="control-label col-md-4">用户编码：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="empCode" readonly/>
                            </div>
                        </div>
                        <div class="form-group col-md-6">
                            <label class="control-label col-md-4">联系方式：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="contactNumber" readonly/>
                            </div>
                        </div>
                        <div class="form-group col-md-6">
                            <label class="control-label col-md-4">电子邮件：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="email" readonly/>
                            </div>
                        </div>
                        <div class="form-group col-md-6">
                            <label class="control-label col-md-4">所属部门：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="orgName" readonly/>
                            </div>
                        </div>
                        <div class="form-group col-md-6">
                            <label class="control-label col-md-4">用户角色：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="roleName" readonly/>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" data-dismiss="modal" aria-hidden="true">
                    返回
                </button>
            </div>
        </div>
    </div>
</div>
<!--修改密码-->
<div class="modal fade" id="myModa2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabe2">
                    修改密码
                </h4>
            </div>
            <div class="modal-body">
                <form id="form"  method="post" class="form-horizontal">
                    <div class="row">
                        <div class="form-group col-md-10">
                            <label class="control-label col-md-4">原密码：</label>
                            <div class="col-md-8">
                                <input type="password" class="form-control" name="loginPwd"/>
                            </div>
                        </div>
                        <div class="form-group col-md-10">
                            <label class="control-label col-md-4">新密码：</label>
                            <div class="col-md-8">
                                <input type="password" class="form-control" name="newPass"/>
                            </div>
                        </div>
                        <div class="form-group col-md-10">
                            <label class="control-label col-md-4">密码确认：</label>
                            <div class="col-md-8">
                                <input type="password" class="form-control" name="newPass1"/>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" onclick="sure()" class="btn btn-primary" data-dismiss="modal" aria-hidden="true">
                    保存
                </button>
                <button type="button" class="btn btn-success" data-dismiss="modal" aria-hidden="true">
                    返回
                </button>
            </div>
        </div>
    </div>
</div>
<!--通知公告-->
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel2">
                    通知公告
                </h4>
            </div>
            <div class="modal-body">
                <form method="post" class="form-horizontal">
                    <div class="row">
                        <div class="form-group col-md-10">
                            <label class="control-label col-md-4">标题：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="noticeTitle"/>
                            </div>
                        </div>
                        <div class="form-group col-md-10">
                            <label class="control-label col-md-4">内容：</label>
                            <div class="col-md-8">
                                <textarea id="noticeContent" class="form-control"></textarea>
                            </div>
                        </div>
                        <div class="form-group col-md-10">
                            <label class="control-label col-md-4">发布人：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" id="publicName"/>
                            </div>
                        </div>
                        <div class="form-group col-md-10">
                            <label class="control-label col-md-4">发布时间：</label>
                            <div class="col-md-8">
                                <input type="text" class="form-control" readonly="readonly" id="cdate"/>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-success" data-dismiss="modal" aria-hidden="true">
                    返回
                </button>
            </div>
        </div>
    </div>
</div>
<!-- jQuery -->
<script src="../static/vendors/jquery/dist/jquery.min.js"
        th:src="@{/vendors/jquery/dist/jquery.min.js}"></script>
<!-- Bootstrap -->
<script src="../static/vendors/bootstrap/dist/js/bootstrap.min.js"
        th:src="@{/vendors/bootstrap/dist/js/bootstrap.min.js}"></script>
<!-- FastClick -->
<script src="../static/vendors/fastclick/lib/fastclick.js"
        th:src="@{/vendors/fastclick/lib/fastclick.js}"></script>
<!-- NProgress -->
<script src="../static/vendors/nprogress/nprogress.js"
        th:src="@{/vendors/nprogress/nprogress.js}"></script>
<!-- Chart.js -->
<script src="../static/vendors/Chart.js/dist/Chart.min.js"
        th:src="@{/vendors/Chart.js/dist/Chart.min.js}"></script>
<!-- gauge.js -->
<script src="../static/vendors/gauge.js/dist/gauge.min.js"
        th:src="@{/vendors/gauge.js/dist/gauge.min.js}"></script>
<!-- bootstrap-progressbar -->
<script src="../static/vendors/bootstrap-progressbar/bootstrap-progressbar.min.js"
        th:src="@{/vendors/bootstrap-progressbar/bootstrap-progressbar.min.js}"></script>
<!-- iCheck -->
<script src="../static/vendors/iCheck/icheck.min.js"
        th:src="@{/vendors/iCheck/icheck.min.js}"></script>
<!-- Skycons -->
<script src="../static/vendors/skycons/skycons.js"
        th:src="@{/vendors/skycons/skycons.js}"></script>
<!-- Flot -->
<script src="../static/vendors/Flot/jquery.flot.js"
        th:src="@{/vendors/Flot/jquery.flot.js}"></script>
<script src="../static/vendors/Flot/jquery.flot.pie.js"
        th:src="@{/vendors/Flot/jquery.flot.pie.js}"></script>
<script src="../static/vendors/Flot/jquery.flot.time.js"
        th:src="@{/vendors/Flot/jquery.flot.time.js}"></script>
<script src="../static/vendors/Flot/jquery.flot.stack.js"
        th:src="@{/vendors/Flot/jquery.flot.stack.js}"></script>
<script src="../static/vendors/Flot/jquery.flot.resize.js"
        th:src="@{/vendors/Flot/jquery.flot.resize.js}"></script>
<!-- Flot plugins -->
<script src="../static/vendors/flot.orderbars/js/jquery.flot.orderBars.js"
        th:src="@{/vendors/flot.orderbars/js/jquery.flot.orderBars.js}"></script>
<script src="../static/vendors/flot-spline/js/jquery.flot.spline.min.js"
        th:src="@{/vendors/flot-spline/js/jquery.flot.spline.min.js}"></script>
<script src="../static/vendors/flot.curvedlines/curvedLines.js"
        th:src="@{/vendors/flot.curvedlines/curvedLines.js}"></script>
<!-- DateJS -->
<script src="../static/vendors/DateJS/build/date.js"
        th:src="@{/vendors/DateJS/build/date.js}"></script>
<!-- JQVMap -->
<script src="../static/vendors/jqvmap/dist/jquery.vmap.js"
        th:src="@{/vendors/jqvmap/dist/jquery.vmap.js}"></script>
<script src="../static/vendors/jqvmap/dist/maps/jquery.vmap.world.js"
        th:src="@{/vendors/jqvmap/dist/maps/jquery.vmap.world.js}"></script>
<script src="../static/vendors/jqvmap/examples/js/jquery.vmap.sampledata.js"
        th:src="@{/vendors/jqvmap/examples/js/jquery.vmap.sampledata.js}"></script>
<!-- bootstrap-daterangepicker -->
<script src="../static/vendors/moment/min/moment.min.js"
        th:src="@{/vendors/moment/min/moment.min.js}"></script>
<script src="../static/vendors/bootstrap-daterangepicker/daterangepicker.js"
        th:src="@{/vendors/bootstrap-daterangepicker/daterangepicker.js}"></script>

<!-- Custom Theme Scripts -->
<script src="../static/build/js/custom.min.js"
        th:src="@{/build/js/custom.min.js}"></script>
<script type="text/javascript" src="../static/js/prompt.js" th:src="@{/js/prompt.js}"></script>
<script type="text/javascript" src="../static/js/scroll.js" th:src="@{/js/scroll.js}"></script>
<!--<script type="text/javascript" src="../static/js/echarts.js" th:src="@{/js/echarts.js}"></script>-->
<script type="text/javascript" src="../static/js/Echarts/echarts.js" th:src="@{/js/Echarts/echarts.js}"></script>

<script src="../static/build/js/my.js"
        th:src="@{/build/js/my.js}"></script>

<script type="text/javascript"  th:inline="javascript">
    $(function(){
        $("#clock3").MyDigitClock({
            fontSize:14,
            fontColor:"#fff",
            background:"rgba(0,0,0,.0)",
            fontWeight:"500",
            timeFormat: '{YY}-{RR} {HH}:{MM}:{SS}'
        });
    });

</script>

<script type="text/javascript" th:inline="javascript">
    /*<![CDATA[*/
    $(function () {
        var isFlg = false;
        var fullscreen = function (elem) {

            if (elem.webkitRequestFullScreen) {
                elem.webkitRequestFullScreen();
            } else if (elem.mozRequestFullScreen) {
                elem.mozRequestFullScreen();
            } else if (elem.requestFullScreen) {
                elem.requestFullscreen();
            } else {
                //浏览器不支持全屏API或已被禁用
            }
        }
        $(".content").easysroll({
//默认配置参数
            direction: "top", //滚动方向 left（向左）right（向右） top(向上) bottom(向下) 默认left
            numberr: "1", //每一次滚动数量 默认是1
            delays:"1000",//完成一次动画所需时间 默认是1000等于1秒
            scrolling: "1000",//每一次动画的时间间隔 默认是1000等于1秒
            fadein:false,//是否支持淡入或淡出 默认false
            enterStop:true //鼠标移入是否暂停滚动 默认是true
        })
        $(".content2").easysroll2({
//默认配置参数
            direction: "top", //滚动方向 left（向左）right（向右） top(向上) bottom(向下) 默认left
            numberr: "1", //每一次滚动数量 默认是1
            delays:"1000",//完成一次动画所需时间 默认是1000等于1秒
            scrolling: "1000",//每一次动画的时间间隔 默认是1000等于1秒
            fadein:false,//是否支持淡入或淡出 默认false
            enterStop:true //鼠标移入是否暂停滚动 默认是true
        })

        var exitFullscreen = function () {
            document.exitFullscreen ? document.exitFullscreen() :
                document.mozCancelFullScreen ? document.mozCancelFullScreen() :
                    document.webkitExitFullscreen ? document.webkitExitFullscreen() : '';
        }
        //    function noNumbers(e) {
        //        var keynum;
        //        var keychar;
        //        keynum = window.event ? e.keyCode : e.which;
        //        keychar = String.fromCharCode(keynum);
        //        alert(keynum + ':' + keychar);
        //    }
        $(".toFullScreen").click(function () {
            fullscreen($(".fullscreenBox")[0]);
            $(".fullscreenBox").attr("style", "position:absolute;top:0;left:0;margin-left:0px;");
            $(".fullscreenBox").append("<span class='glyphicon glyphicon-log-in exitFS'></span>");
            $(".exitFS").attr("style", "position:absolute;top:30px;right:30px;font-size:20px;")
        })
        $(document).on("click", ".exitFS", function () {
            exitFullscreen($(".fullscreenBox")[0]);
            $(".fullscreenBox").attr("style", "");
            $(".exitFS").remove();
            exitFullscreen($(".fullscreenBox")[0]);
        })

        //将登陆人姓名存入sessionStorage中
        sessionStorage.setItem("userName", [[${userName}]]);
        document.cookie = "userName=[[${userName}]];"
        $("#userName").text([[${userName}]]);
    })

    //查询个人资料
    function js_method() {
        var loginName = sessionStorage.getItem("userName");
        $.post("/getUserInfo", {"loginName": loginName}, function (result) {
            $("#loginName").val(result.sysEmp.loginName);
            $("#empCode").val(result.sysEmp.empCode);
            $("#contactNumber").val(result.sysEmp.contactNumber);
            $("#email").val(result.sysEmp.email);
            $("#orgName").val(result.orgName.orgName);
            $("#roleName").val(result.sysEmp.roleName);
        });
    }

    //密码修改提交
    function sure() {
        var obj = $("#form").serialize();
        $.post("/modifyPwd",obj, function (result) {
            if(result ==1){
                $.MsgBox.Alert("提示", "原密码不正确");
                $("input[name=loginPwd]").val("");
            }else if(result == 2){
                $.MsgBox.Alert("提示", "新密码和确认密码不正确");
                $("input[name=newPass]").val("");
                $("input[name=newPass1]").val("");
            }else {
                // $.MsgBox.Alert("提示", "密码修改成功");
                alert("密码修改成功!请重新登录");
                window.location.href = "/login";
            }
        })
    }

    function toMainPage() {
        var loginName = sessionStorage.getItem("userName");
        $.post("/index", {"loginName": loginName}, function (result) {

        })
    }

    function queryNotice(obj) {
        var noticeId=$(obj).attr("id");
        $.post("/noticeAdministration/findOne", {"noticeId": noticeId}, function (result) {
            $("#noticeTitle").val(result.noticeTitle);
            $("#noticeContent").val(result.noticeContent);
            $("#publicName").val(result.publicName);
            $("#cdate").val(result.cdate);
        });
    }

    /*]]>*/
</script>

<script type="text/javascript" th:inline="javascript">
    var eventList=[[${eventList}]];
    var finishNum=[[${finishNum}]];
    var dealNum=[[${dealNum}]];
    var total=[[${total}]];
    var wgTotal=[[${wgTotal}]];
    var wgFinish=[[${wgFinish}]];
    var finishText=  " <div class='progress progress_sm' style='width: 50%;'> " +
        "<div class='progress-bar bg-green' role='progressbar' data-transitiongoal='100' style='width: "+parseInt(finishNum)/parseInt(total)*100+"%;'></div>"+
        "</div>"+
        "<p class='js_block'>已完成:"+ finishNum+"件 共计:"+total+"件  完成率:"+ "<span class='wcl1'>"+(parseInt(finishNum)/parseInt(total)*100).toFixed(0)+"</span>"+"%</p>";
    $("#finish").append(finishText);
    var dealText = " <div class='progress progress_sm' style='width: 50%;'> " +
        "<div class='progress-bar bg-green' role='progressbar' data-transitiongoal='100' style='width: "+parseInt(dealNum)/parseInt(total)*100+"%;'></div>"+
        "</div>"+
        "<p class='js_block'>未完成:"+ dealNum+"件 共计:"+total+"件  未完成率:"+"<span class='wcl2'>"+(parseInt(dealNum)/parseInt(total)*100).toFixed(0)+"</span>"+"%</p>" ;
    $("#deal").append(dealText);

    var wgText= " <div class='progress progress_sm' style='width: 50%;'> " +
    "<div class='progress-bar bg-green' role='progressbar' data-transitiongoal='100' style='width: "+parseInt(wgFinish)/parseInt(wgTotal)*100+"%;'></div>"+
    "</div>"+
     "<p class='js_block'>已完成:"+ wgFinish+"件 共计:"+wgTotal+"件  完成率:"+"<span class='wcl3'>"+(parseInt(wgFinish)/parseInt(wgTotal)*100).toFixed(0)+"</span>"+"%</p>"  ;
    $("#wgEvent").append(wgText);
    var wcl =$(".wcl1").text();
    var wcl2 =$(".wcl2").text();
    var wcl3 =$(".wcl3").text();
    if ( wcl=="NaN") {
        $(".wcl1").text("0");
    }
    if ( wcl2=="NaN") {
        $(".wcl2").text("0");
    }
    if ( wcl3=="NaN") {
        $(".wcl3").text("0");
    }




    var org=[];
    var finish=[];
    var deal=[];
    var rate=[];
    $(eventList).each(function (i,v) {
        if(v.orgName==null){
            org.push("");
        }else{
            org.push(v.orgName);
        }
        if(v.finishEventNum==null){
            finish.push("0");
        }else{
            finish.push(v.finishEventNum);
        }
        if(v.dealEventNum==null){
            deal.push("0");
        }else{
            deal.push(v.dealEventNum);
        }
        if(v.finishEventNum==null){
            rate.push('0%');
        }else if(v.dealEventNum==null){
            rate.push('100%');
        }else{
            var ra;
            ra=parseInt(v.finishEventNum)/(parseInt(v.finishEventNum)+parseInt(v.dealEventNum))*100;
            rate.push(ra.toFixed(2));
        }
    })

</script>


<script type="text/javascript" th:inline="javascript">
    var myChart = echarts.init(document.getElementById('eventChart'));
//    option = {
//        legend: {
//            data:['已完成','处理中','完成率']
//        },
//        xAxis: [
//            {
//                type: 'category',
//                data: org,
//                axisPointer: {
//                    type: 'shadow'
//                }
//            }
//        ],
//        yAxis: [
//            {
//                type: 'value',
//                name: '事件数量',
//                min: 0,
////                max: 250,
//                interval: 50,
//                axisLabel: {
//                    formatter: '{value} 件'
//                }
//            },
//            {
//                type: 'value',
//                name: '完成率',
//                min: 0,
//                max: 100,
//                interval: 0.5,
//                axisLabel: {
//                    formatter: '{value} %'
//                }
//            }
//        ],
//        series: [
//            {
//                name:'已完成',
//                type:'bar',
//                data:finish
//            },
//            {
//                name:'处理中',
//                type:'bar',
//                data:deal
//            },
//            {
//                name:'完成率',
//                type:'bar',
//                yAxisIndex: 1,
//                data:rate
//            }
//        ]
//    };

    option = {
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'cross',
                crossStyle: {
                    color: '#999'
                }
            }
        },
        legend: {
            data:['已完成','处理中','完成率']
        },
        xAxis: [
            {
                type: 'category',
                data: org,
                axisPointer: {
                    type: 'shadow'
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                name: '事件数量',
                min: 0,
                interval: 50,
                axisLabel: {
                    formatter: '{value} 件'
                }
            },
            {
                type: 'value',
                name: '完成率',
                min: 0,
                max: 100,
                axisLabel: {
                    formatter: '{value} %'
                }
            }
        ],
        series: [
            {
                name:'已完成',
                type:'bar',
                data:finish
            },
            {
                name:'处理中',
                type:'bar',
                data:deal
            },
            {
                name:'完成率',
                type:'bar',
                data:rate
            }

        ]
    };
    myChart.setOption(option);

</script>

<script type="text/javascript" th:inline="javascript">
    var savelist=[[${savelist}]];
    var wglist=[[${wglist}]];
    var org=[];
    var total=[];
    var saveTotal=[];
    $(wglist).each(function (i,v) {
        if(v.orgName!=null){
            org.push(v.orgName);
        }
            total.push({value: (parseInt(v.dealEventNum)+parseInt(v.finishEventNum)), name: v.orgName});
    });
    $(savelist).each(function (i,v) {
        saveTotal.push({value: v.dealEventNum, name: v.orgName});
    });



    var myChart2 = echarts.init(document.getElementById('wgEventEcha'));

    option = {
        tooltip : {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            //orient: 'vertical',
            x: 'center',
            y : 'bottom',
            data:org
        },
        series: [

            {
                name:'网格事件',
                type:'pie',
                radius: ['50%', '30%'],
                center : ['25%', '25%'],

                avoidLabelOverlap: false,

                label: {
                    normal: {
                        show: false,
                    }

                },
                data:total
            },
            {
                name:'治安事件',
                type:'pie',
                radius: ['50%', '30%'],
                center : ['75%', '25%'],
                avoidLabelOverlap: false,
                label: {
                    normal: {
                        show: false,
                    }

                },
                data:saveTotal
            }
        ]
    };

    myChart2.setOption(option);
</script>
<script type="text/javascript" th:inline="javascript">
    /*<![CDATA[*/
    var cz=[[${cz}]];//常驻
    var ld=[[${ld}]];//流动
    var dy=[[${dy}]];//党员
    var fny=[[${fny}]];//非农业
    var total=parseInt(cz)+parseInt(ld);//人口总数
    var czText="<div class='col-xs-4' style='width: 130px'><ul class='mjd'>";
            if((parseInt(cz)/parseInt(total))<0.25 || (parseInt(cz)/parseInt(total)*100).toFixed(0) == "NaN"){
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";
            }else if(0.25<=(parseInt(cz)/parseInt(total)) && (parseInt(cz)/parseInt(total))<0.5){
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";
                czText+="<li style='float: left'><img src='images/people1.png' width='14px' height='38px'></li>";
            }else if(0.5<=(parseInt(cz)/parseInt(total)) && (parseInt(cz)/parseInt(total))<0.75){
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";

            }else{
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";
                czText+="<li style='float: left'><img src='/images/people1.png' width='14px' height='38px'></li>";

            }
            czText+="</ul>";
            czText+="</div>";
            czText+="<div class='col-xs-4' style='left: -31px;width: 60px'>";
            var czPeople;
            if((parseInt(cz)/parseInt(total)*100).toFixed(0) == "NaN"){
                czPeople = 0;
            }else {
                czPeople = (parseInt(cz)/parseInt(total)*100).toFixed(0);
            }
            czText+="    <div class='circle1' style=' width: 50px;height: 50px;border-radius: 50px; color: #ffffff;background:#01a8df;font-size: 18px;line-height: 50px;text-align: center '>"+czPeople+"%</div>";
            czText+="</div>";
            czText+="<div class='col-xs-4'>";
            czText+="   <div class='right' style='font-weight: bolder'>常驻</div>";
            czText+="   <div class='right prop'>数量："+cz+"</div>";
            czText+="</div>";
    $("#CZpopulation").append(czText);

    var ldText="<div class='col-xs-4' style='width: 130px'><ul class='mjd'>";
    if((parseInt(ld)/parseInt(total))<0.25 || (parseInt(ld)/parseInt(total)*100).toFixed(0) == "NaN"){
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
    }else if(0.25<=(parseInt(ld)/parseInt(total)) && (parseInt(ld)/parseInt(total))<0.5){
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        ldText+="<li style='float: left'><img src='images/people1.png'  width='14px' height='38px'></li>";
    }else if(0.5<=(parseInt(ld)/parseInt(total)) && (parseInt(ld)/parseInt(total))<0.75){
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";

    }else{
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        ldText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";

    }
    var ldPeople;
    if((parseInt(ld)/parseInt(total)*100).toFixed(0) == "NaN"){
        ldPeople = 0;
    }else {
        ldPeople = (parseInt(ld)/parseInt(total)*100).toFixed(0);
    }
    ldText+="</ul>";
    ldText+="</div>";
    ldText+="<div class='col-xs-4' style='left: -31px;width: 60px'>";
    ldText+="    <div class='circle1' style=' width: 50px;height: 50px;border-radius: 50px; color: #ffffff;background:#01a8df;font-size: 18px;line-height: 50px;text-align: center '>"+ldPeople+"%</div>";
    ldText+="</div>";
    ldText+="<div class='col-xs-4'>";
    ldText+="   <div class='right' style='font-weight: bolder'>流动</div>";
    ldText+="   <div class='right prop'>数量："+ld+"</div>";
    ldText+="</div>";
    $("#LDpopulation").append(ldText);

    var dyText="<div class='col-xs-4' style='width: 130px'><ul class='mjd'>";
    if((parseInt(dy)/parseInt(total))<0.25 ||(parseInt(dy)/parseInt(total)*100).toFixed(0) == "NaN"){
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
    }else if(0.25<=(parseInt(dy)/parseInt(total)) && (parseInt(dy)/parseInt(total))<0.5){
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        dyText+="<li style='float: left'><img src='images/people1.png'  width='14px' height='38px'></li>";
    }else if(0.5<=(parseInt(dy)/parseInt(total)) && (parseInt(dy)/parseInt(total))<0.75){
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";

    }else{
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        dyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";

    }
    var czdyPeople;
    if((parseInt(dy)/parseInt(total)*100).toFixed(0) == "NaN"){
        czdyPeople = 0;
    }else {
        czdyPeople = (parseInt(dy)/parseInt(total)*100).toFixed(0);
    }
    dyText+="</ul>";
    dyText+="</div>";
    dyText+="<div class='col-xs-4' style='left: -31px;width: 60px'>";
    dyText+="    <div class='circle1' style=' width: 50px;height: 50px;border-radius: 50px; color: #ffffff;background:#01a8df;font-size: 18px;line-height: 50px;text-align: center '>"+czdyPeople+"%</div>";
    dyText+="</div>";
    dyText+="<div class='col-xs-4'>";
    dyText+="   <div class='right' style='font-weight: bolder'>常驻人口党员数量</div>";
    dyText+="   <div class='right prop'>数量："+dy+"</div>";
    dyText+="</div>";
    $("#DYpopulation").append(dyText);

    var fnyText="<div class='col-xs-4' style='width: 130px'><ul class='mjd'>";
    if((parseInt(fny)/parseInt(total))<0.25 || (parseInt(fny)/parseInt(total)*100).toFixed(0) == "NaN"){
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
    }else if(0.25<=(parseInt(fny)/parseInt(total)) && (parseInt(fny)/parseInt(total))<0.5){
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        fnyText+="<li style='float: left'><img src='images/people1.png'  width='14px' height='38px'></li>";
    }else if(0.5<=(parseInt(fny)/parseInt(total)) && (parseInt(fny)/parseInt(total))<0.75){
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";

    }else{
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";
        fnyText+="<li style='float: left'><img src='/images/people1.png'  width='14px' height='38px'></li>";

    }
    var czfnPeople;
    if((parseInt(fny)/parseInt(total)*100).toFixed(0) == "NaN"){
        czfnPeople = 0;
    }else {
        czfnPeople = (parseInt(fny)/parseInt(total)*100).toFixed(0);
    }
    fnyText+="</ul>";
    fnyText+="</div>";
    fnyText+="<div class='col-xs-4' style='left: -31px;width: 60px'>";
    fnyText+="    <div class='circle1' style=' left: ;width: 50px;height: 50px;border-radius: 50px; color: #ffffff;background:#01a8df;font-size: 18px;line-height: 50px;text-align: center '>"+czfnPeople+"%</div>";
    fnyText+="</div>";
    fnyText+="<div class='col-xs-4'>";
    fnyText+="   <div class='right' style='font-weight: bolder'>常驻人口非农业户口数量</div>";
    fnyText+="   <div class='right prop'>数量："+fny+"</div>";
    fnyText+="</div>";
    $("#FNYpopulation").append(fnyText);

    /*]]>*/
</script>

</body>
</html>
